<template>
  <div class="goods contain">
    <ul class="goods-con">
      <li v-for="item in data" :key="Date.now() + item._id">
        <img :src="baseUrl + item.coverImg" class="image" />
        
        <!-- <el-card :body-style="{ padding: '0px' }">
          <img :src="baseUrl + item.coverImg" class="image" />
          <div style="padding: 14px">
            <span>{{ item.goodsName }}</span>
            <div class="bottom clearfix">
              <time class="time">{{ item.price }}</time>
              <el-button type="text" class="button">操作按钮</el-button>
            </div>
          </div>
        </el-card> -->
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      baseUrl: process.env.VUE_APP_BASE_API,
      data: [],
      count: 0,
    };
  },
  methods: {
    load() {
      this.axios.get("/api/v1/product").then((res) => {
        console.log(res);
      });
    },
  },
  created() {
    this.axios.get("/api/v1/product").then((res) => {
      console.log(res);
      this.data = res.data;
    });
  },
};
</script>
<style scoped>
.goods {
  height: 100%;
  /* overflow: auto; */
}
.goods-con {
  display: flex;
  justify-content: space-around;
}
.goods-con li {
  float: left;
  width: 100%;
  height: 180px;
}
.goods-con img {
  /* height: 175px;
  width: 260px; */
  height: 100%;
}
</style>